<template><div>
                <div class="content__inner">
                    <header class="content__title">
                        <h1>Photo Gallery</h1>

                        <div class="actions">
                            <a href="" class="actions__item zmdi zmdi-trending-up"></a>
                            <a href="" class="actions__item zmdi zmdi-check-all"></a>

                            <div class="dropdown actions__item">
                                <i data-toggle="dropdown" class="zmdi zmdi-more-vert"></i>
                                <div class="dropdown-menu dropdown-menu-right">
                                    <a href="" class="dropdown-item">Refresh</a>
                                    <a href="" class="dropdown-item">Manage Widgets</a>
                                    <a href="" class="dropdown-item">Settings</a>
                                </div>
                            </div>
                        </div>
                    </header>

                    <div class="toolbar">
                        <div class="toolbar__label"><span class="hidden-xs-down">Total</span> 543 Photos</div>

                        <div class="actions">
                            <i class="actions__item zmdi zmdi-search" data-ma-action="toolbar-search-open"></i>
                            <a href="" class="actions__item zmdi zmdi-time"></a>
                            <div class="dropdown actions__item">
                                <i class="zmdi zmdi-sort" data-toggle="dropdown"></i>

                                <div class="dropdown-menu dropdown-menu-right">
                                    <a href="" class="dropdown-item">Last Modified</a>
                                    <a href="" class="dropdown-item">Name</a>
                                    <a href="" class="dropdown-item">Size</a>
                                </div>
                            </div>
                            <a href="" class="actions__item zmdi zmdi-help-outline"></a>
                        </div>

                        <div class="toolbar__search">
                            <input type="text" placeholder="Search..."/>
                            <i class="toolbar__search__close zmdi zmdi-long-arrow-left" data-ma-action="toolbar-search-close"></i>
                        </div>
                    </div>

                    <div class="card">
                        <div class="card-block">
                            <nav class="card-block__nav text-center">
                                <a class="active" href="">Photos</a>
                                <a href="">Album</a>
                                <a href="">Upload</a>
                            </nav>

                            <div class="row lightbox photos">

                                <a href="/static/demo/img/gallery/1.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/1.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/2.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/2.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/3.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/3.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/4.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/4.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/5.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/5.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/6.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/6.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/7.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/7.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/8.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/8.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/9.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/9.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/10.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/10.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/11.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/11.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/12.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/12.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/13.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/13.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/14.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/14.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/15.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/15.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/16.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/16.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/17.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/7.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/18.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/18.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/19.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/19.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/20.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/20.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/21.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/21.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/22.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/22.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/23.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/23.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/24.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/24.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/1.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/1.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/2.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/2.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/3.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/3.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/4.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/4.jpg" alt=""/>
                                    </div>
                                </a>

                                <a href="/static/demo/img/gallery/5.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/5.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/6.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/6.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/7.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/7.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/8.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/8.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/9.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/9.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/10.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/10.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/11.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/11.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/12.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/12.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/13.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/13.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/14.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/14.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/15.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/15.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/16.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/16.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/17.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/7.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/18.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/18.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/19.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/19.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/20.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/20.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/21.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/21.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/22.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/22.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/23.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/23.jpg" alt=""/>
                                    </div>
                                </a>
                                <a href="/static/demo/img/gallery/24.jpg" class="col-md-2 col-4">
                                    <div class="lightbox__item photos__item">
                                        <img src="/static/demo/img/gallery/thumbs/24.jpg" alt=""/>
                                    </div>
                                </a>
                            </div>

                            <a href="" class="view-more text-xs-center">Load more...</a>
                        </div>
                    </div>
                </div>

                
            </div></template>